<!DOCTYPE html>
<html>

<head>

	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<title>物品审批</title>
	<meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
	<meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">

	<link rel="shortcut icon" href="favicon.ico">
	<link href="css/bootstrap.min.css-v=3.3.5.css"
		  tppabs="http://www.zi-han.net/theme/hplus/css/bootstrap.min.css?v=3.3.5" rel="stylesheet">
	<link href="css/font-awesome.min.css-v=4.4.0.css"
		  tppabs="http://www.zi-han.net/theme/hplus/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
	<link href="css/plugins/iCheck/custom.css"
		  tppabs="http://www.zi-han.net/theme/hplus/css/plugins/iCheck/custom.css" rel="stylesheet">
	<link href="css/animate.min.css" tppabs="http://www.zi-han.net/theme/hplus/css/animate.min.css"
		  rel="stylesheet">
	<link href="css/style.min.css-v=4.0.0.css" tppabs="http://www.zi-han.net/theme/hplus/css/style.min.css?v=4.0.0"
		  rel="stylesheet">
	<!--    <base target="_blank">-->
	<link rel="stylesheet" type="text/css" href="./layui/css/layui.css"/>
	<style>
		#zhuti {
			height: 100%;

		}

		#zhuti::before {
			background: url('img/lg.jpg') no-repeat fixed center;
			background-size: 300px;
			content: "";
			opacity: 0.2;
			/*透明度设置*/
			width: 80%;
			height: 80%;
			position: absolute;
		}

		#xiaohuiid {
			border-top: 0;
			padding-left: 20px;
			height: 360px;
			background-color: #fff;
			margin-right: -15px;
			margin-left: -15px;
		}
	</style>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">

	<div class="row">
		<div class="col-sm-12">
			<div class="ibox float-e-margins">
<!--				<div class="ibox-title">-->
<!--					<h3 style="font-weight: 600;margin-top: 0;">申请详情</h3>-->
<!--					<button onclick="correctExport()" class="btn-info" style="float: right;">导出Word</button>-->
<!--					<form action="/user/exportWord" class="word_form" method="post" style="display: none">-->
<!--						<input name="fid" class="word_input" type="text"/>-->
<!--						<input class="word_submit" type="submit"/>-->
<!--					</form>-->
<!--				</div>-->

				<div class="ibox-content" id="zhuti">
					<!--                    upd意思为取消只读-->
					<div method="post" id="bigform" autocomplete="off" class="form-horizontal">
						<div id="thing">

						</div>

						<div id="static">
							<div class="form-group">
								<label class="col-sm-2 control-label">活动名称</label>
								<div class="col-sm-3">
									<input readonly="readonly" id="hdmc" type="text" name="meetingneirong"
										   placeholder=""
										   class="form-control"
										   required>
								</div>

								<label class="col-sm-2 control-label">活动方</label>
								<div class="col-sm-4">
									<input readonly="readonly" id="ssxy" type="text" name="teashu" required
										   placeholder=""
										   class="form-control">
								</div>
								<label style="margin-top: 10px" class="col-sm-2 control-label">申请人</label>
								<div style="margin-top: 10px" class="col-sm-3">
									<input readonly="readonly" id="sqr" type="text" name="meetingneirong"
										   placeholder="请输入申请人"
										   class="form-control"
										   required>
								</div>
								<label style="margin-top: 10px" class="col-sm-2 control-label">联系电话</label>
								<div style="margin-top: 10px" class="col-sm-4">
									<input readonly="readonly" id="lxdh" type="text" name="teashu" required
										   placeholder=""
										   class="form-control">
								</div>
							</div>


							<div class="form-group" id="laydate">
								<label class="col-sm-2 control-label">借用开始时间</label>
								<div class="col-sm-3">
									<input readonly="readonly" type="text" name="startTime" required
										   placeholder="yyyy-MM-dd HH:mm:ss"
										   class="form-control"
										   id="test1">
								</div>
								<label class="col-sm-2 control-label">借用结束时间</label>
								<div class="col-sm-4">
									<input readonly="readonly" type="text" name="endTime" required
										   placeholder="yyyy-MM-dd HH:mm:ss"
										   class="form-control"
										   id="test2">
								</div>
							</div>

							<div class="form-group">

								<label class="col-sm-2 control-label">借用原因</label>
								<div class="col-sm-4">
									<input readonly="readonly" id="jyyy" type="text" name="meetingname" required
										   placeholder="请输入借用原因"
										   class="form-control">
								</div>
							</div>

							<!--                        借用情况-->
							<div class="ibox-title">
								<h3 style="font-weight: 600;margin-top: 0;padding-right: 500px;">
									借出情况:</h3>
							</div>
							<div class="form-group">
								<label class="col-sm-2 control-label">取走人员</label>
								<div class="col-sm-3">
									<input readonly="readonly" id="qzry" type="text" name="meetingneirong"
										   placeholder=""
										   class="form-control"
										   required>
								</div>
								<label class="col-sm-2 control-label">联系电话</label>
								<div class="col-sm-4">
									<input readonly="readonly" id="jcdh" type="text" name="teashu" required
										   placeholder=""
										   class="form-control">
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-2 control-label">值班人员</label>
								<div class="col-sm-3">
									<input readonly="readonly" id="jczb" type="text" name="meetingneirong"
										   placeholder=""
										   class="form-control"
										   required>
								</div>
<!--								<label class="col-sm-2 control-label">借出时间</label>-->
<!--								<div class="col-sm-4">-->
<!--									<input readonly="readonly" id="jcsj" type="text" name="teashu" required-->
<!--										   placeholder=""-->
<!--										   class="form-control">-->
<!--								</div>-->
							</div>

							<!--编号-->
							<div class="form-group">
								<label class="col-sm-2 control-label">需要归还的物品编号</label>
								<div class="col-sm-3">
									<input readonly="readonly" id="needAllSigns" type="text" name="meetingneirong"
										   placeholder=""
										   class="form-control"
										   required>
								</div>
								<label class="col-sm-2 control-label">借出的所有物品编号</label>
								<div class="col-sm-4">
									<input readonly="readonly" id="allSigns" type="text" name="teashu" required
										   placeholder=""
										   class="form-control">
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-2 control-label">已经归还的物品编号</label>
								<div class="col-sm-3">
									<input readonly="readonly" id="alreadyReturnSign" type="text" name="meetingneirong"
										   placeholder=""
										   class="form-control"
										   required>
								</div>
							</div>

							<div class="form-group">
								<label class="col-sm-2 control-label">借出备注</label>
								<div class="col-sm-9">
									<input readonly="readonly" id="jcbz" type="text" name="meetingneirong"
										   placeholder=""
										   class="form-control"
										   required>
								</div>
							</div>
							<!--                        归还情况-->
							<div class="ibox-title">
								<h3 style="font-weight: 600;margin-top: 0;padding-right: 500px;">
									归还情况:</h3>
							</div>
							<div class="form-group">
								<label class="col-sm-2 control-label">归还人员</label>
								<div class="col-sm-3">
									<input readonly="readonly" id="ghry" type="text" name="meetingneirong"
										   placeholder=""
										   class="form-control"
										   required>
								</div>
								<label class="col-sm-2 control-label">联系电话</label>
								<div class="col-sm-4">
									<input readonly="readonly" id="ghdh" type="text" name="teashu" required
										   placeholder=""
										   class="form-control">
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-2 control-label">值班人员</label>
								<div class="col-sm-3">
									<input readonly="readonly" id="ghzb" type="text" name="meetingneirong"
										   placeholder=""
										   class="form-control"
										   required>
								</div>
<!--								<label class="col-sm-2 control-label">归还时间</label>-->
<!--								<div class="col-sm-4">-->
<!--									<input readonly="readonly" id="ghsj" type="text" name="teashu" required-->
<!--										   placeholder=""-->
<!--										   class="form-control">-->
<!--								</div>-->
							</div>
							<div class="form-group">
								<label class="col-sm-2 control-label">归还备注</label>
								<div class="col-sm-9">
									<input readonly="readonly" id="ghbz" type="text" name="meetingneirong"
										   placeholder=""
										   class="form-control"
										   required>
								</div>
							</div>
							<div class="hr-line-dashed"></div>
						</div>

						<!--                        返回功能-->
						<div class="form-group">
							<div class="col-sm-3 col-sm-offset-4">
								<a target="_self" href="myState.html">
									<input type="submit"
										   class="btn btn-info"
										   value="返回" style="margin-right: 40%">
								</a>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script src="./layui/layui.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.min.js-v=2.1.4"
		tppabs="http://www.zi-han.net/theme/hplus/js/jquery.min.js?v=2.1.4"></script>
<script src="layui/layer/layer.js" type="text/javascript" charset="utf-8"></script>
<script src="js/bootstrap.min.js-v=3.3.5"
		tppabs="http://www.zi-han.net/theme/hplus/js/bootstrap.min.js?v=3.3.5"></script>
<script src="js/content.min.js-v=1.0.0"
		tppabs="http://www.zi-han.net/theme/hplus/js/content.min.js?v=1.0.0"></script>
<script src="js/plugins/iCheck/icheck.min.js"
		tppabs="http://www.zi-han.net/theme/hplus/js/plugins/iCheck/icheck.min.js"></script>
<script type="text/javascript">

let id = 0;
let state = "";
let st = ''
let et = ''
let fid = ''
let thingList = []

//页面入口函数
$(document).ready(function ab() {
    // console.log($('#static .control-label'))
    // console.log($('#static input'))
    let x = GetRequest();
    fid = x.fid
	console.log(x)
    // console.log(fid)
    getDetail()
});

//批准
function sy() {
    let app = $('#spr').val();
    let xx = "审批通过";
    $.ajax({
        type: "POST",
        url: "admin/doBorrowThingApply",
        data: {
            fid: fid,
            approver: app,
            mark: '1'
        },
        success: function (msg) {
            $('#tijiao').hide()
            $('#reset1').hide()
            //console.log(msg);
            layer.alert(msg);
        }
    });
}

//拒绝
function sy2() {
    let app = $('#spr').val();
    // let xx = "审批通过";
    $.ajax({
        type: "POST",
        url: "admin/doBorrowThingApply",
        data: {
            fid: fid,
            approver: app,
            mark: '0'
        },
        success: function (msg) {
            $('#tijiao').hide()
            $('#reset1').hide()
            //console.log(msg);
            layer.alert(msg);
        }
    });
}

<!--获取url后边的参数-->
function GetRequest() {
    const url = location.search; //获取url中"?"符后的字串
    let theRequest = new Object();
    if (url.indexOf("?") != -1) {
        let str = url.substr(1);
        let strs = str.split("&");
        for (let i = 0; i < strs.length; i++) {
            theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
        }
    }
    return theRequest;
}

//分组
function classify(arr) {
    let map = {};
    let myArr = [];
    for (let i = 0; i < arr.length; i++) {
        if (!map[arr[i].name]) {
            myArr.push({
                name: arr[i].name,
                data: [arr[i]]
                // id: arr[i].id,
                // data: [arr[i]]
            });
            map[arr[i].name] = arr[i]
        } else {
            for (let j = 0; j < myArr.length; j++) {
                if (arr[i].name === myArr[j].name) {
                    myArr[j].data.push(arr[i]);
                    break
                }
            }
        }
    }
    return myArr
}

//获取申请详情
function getDetail() {
    $.ajax({
        type: "GET",
        url: "/user/getActById",
        data: {
            id: fid
        },
        success: function (msg) {
            let list = msg.list
            //console.log(msg);
            filling(msg.activity);
            filling2(msg)
            //console.log(classify(list))
            addThings(classify(list))
            thingList = classify(list)
        }
    });
}

//填写底部输入框信息
function filling(msg) {
    $('#hdmc').val(msg.actName)
    $('#sqr').val(msg.applicant)
    $('#lxdh').val(msg.tel)
    $('#ssxy').val(msg.organizer)
    $('#jyyy').val(msg.reason)
    $('#test1').val(msg.startTime)
    $('#test2').val(msg.endTime)
	$('#needAllSigns').val(msg.unReturnThings)
	$('#allSigns').val(msg.allThings)
	$('#alreadyReturnSign').val(msg.returnedThings)
}

//填写借用归还情况
function filling2(msg) {
	console.log("!!! ")
	console.log(msg)
	if (msg.bring!=null){
		$('#qzry').val(msg.bring.bname)
		$('#jcdh').val(msg.bring.tel)
		$('#jczb').val(msg.bring.dutyPerson)
		// $('#jcsj').val(msg.Activity.gtime)
		$('#jcbz').val(msg.bring.mes)
	}

	if (msg.back!=null){

		$('#ghry').val(msg.back.rname)
		$('#ghdh').val(msg.back.tel)
		$('#ghzb').val(msg.back.dutyPerson)
		// $('#ghsj').val(msg.Back.rtime)
		$('#ghbz').val(msg.back.mes)
	}

}

//动态添加物品及数量
function addThings(msg) {
    //console.log(msg)
    for (let i = 0; i < msg.length; i++) {
        addName(msg[i].name)
        let content = '<div class="form-group">'
        let list = msg[i].data;
        // console.log(list);
        for (let j = 0; j < list.length; j++) {
            content += addSize(list[j].size, list[j].num)
        }
        console.log("!!!!!!!!!!!!!!"+content)
        content = content + '</div>';
        $('#thing').append(content);
    }
    addName('具体信息')
}

//添加一个物品名称
function addName(name) {
    let nameString = '<div class="ibox-title">\n' +
        '                            <h3 style="font-weight: 600;margin-top: 0;padding-right: 500px;">\n' +
        '                                ' + name + ':</h3>\n' +
        '                        </div>'
    $('#thing').append(nameString);
}

//添加物品的一个规格
function addSize(size, number) {
    let item = ' <label class="col-sm-3 control-label">' + size + ':</label>\n' +
        '                            <div class="col-sm-2 row" style="margin-bottom: 14px;">\n' +
        '                                <input disabled="disabled" value=' + number + ' type="number" class="form-control">\n' +
        '                            </div>'
    return item;
}

<!--  导出word  -->
function correctExport() {
    $(".word_input").val(fid);
    $(".word_form").submit();
    //
}

// 初始化表格
function fnClickAddRow() {
    $("#editable").dataTable().fnAddData(["Custom row", "New row", "New row", "New row", "New row"])
};

// 导表模块
// 获取表格
function getExportData() {
    //console.log(thingList)
    var data = []

    let lable = $('#static .control-label')
    let input = $('#static input')
    for (let i = 0; i < thingList.length; i++) {
        let thingName = {
            col1: thingList[i].name
        }
        data.push(thingName)
        let sizeList = thingList[i].data
        for (let j = 0; j < sizeList.length; j++) {
            let content = {
                col1: sizeList[j].size,
                col2: sizeList[j].num
            }
            data.push(content)
        }
    }

    let title1 = {
        col1: '具体信息'
    }
    data.push(title1)
    for (let i = 0; i <= 5; i++) {
        let content = {
            col1: lable[i].innerText,
            col2: input[i].value
        }
        data.push(content)
    }

    let title2 = {
        col1: '借出情况'
    }
    data.push(title2)
    for (let i = 6; i <= 10; i++) {
        let content = {
            col1: lable[i].innerText,
            col2: input[i].value
        }
        data.push(content)
    }

    let title3 = {
        col1: '归还情况'
    }
    data.push(title3)
    for (let i = 11; i <= 15; i++) {
        let content = {
            col1: lable[i].innerText,
            col2: input[i].value
        }
        data.push(content)
    }

    return data
}
</script>

<script type="text/javascript" src="../../../tajs.qq.com/stats-sId=9051096"
		tppabs="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
</body>

</html>
